<template>
    <div>
        {{abc}}
        <button @click="$emit('getChange',msg)">点击更新</button>
        <h1>{{ num }}</h1>
    </div>
</template>
<script>
export default {
    props:['abc'],
    data(){
        return{
            num:1,
            //定时器对象
            myTime:null,
            msg:"我要被更新了,updated生命周期会被执行"
        }
    },
//创建
    beforeCreate(){
        console.log("1.创建前")
    },
    created(){
        console.log("2.创建后")
    },
//挂载
    beforeMount(){
        //骨架屏--技术
        console.log("3.挂载前")
    },
    //当页面加载完成发起一个请求,写这里
    mounted(){
        //挂载成功相当于window.onload
        //请求---单词请求---轮询请求

        this.myTime = setInterval(()=>{
            this.num++;
            console.log("成功")
        },1000)
        console.log("4.挂载成功")
    },
//更新:当data或props数据修改时触发
    beforeUpdate(){
        console.log("更新前")
    },
    updated(){
        console.log("更新后")
    },
//卸载-销毁
beforeDestroy(){
    console.log("卸载前")
    window.clearInterval(this.myTime)
},
destroyed(){
    console.log("卸载完成")
}

}
</script>